import React from 'react'
import { TabBar } from 'antd-mobile'
import { Route } from "react-router-dom";

// 引入首页 找房  我的页面
import Index from "../pages/index/index"
import Found from "../pages/found"
import My from "../pages/my"
class TabBarTest extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            selected: 'blueTab',
            hidden: false,
            fullScreen: false
        }

    }
    renderContent(pageText) {
        return <div>
            <div>{pageText}</div>
        </div>

    }
    render() {
        return (
            <div style={{ position: 'fixed', height: '100%', width: '100%', top: 0 }}>
                <TabBar
                    unselectedTintColor="#949494"
                    tintColor="#33A3F4"
                    barTintColor="white"
                >
                    <TabBar.Item
                        title="首页"
                        key="Index"
                        icon={<div className="iconfont icon-ind" />
                        }
                        selectedIcon={<div className="iconfont icon-ind" />
                        }
                        selected={this.state.selectedTab === 'blueTab'}
                        onPress={() => {
                            this.props.history.push("/home/index")
                        }}

                    >
                        <Route path="/home/index" component={Index}></Route>
                    </TabBar.Item>
                    <TabBar.Item
                        icon={
                            <div className="iconfont icon-findHouse" />
                        }
                        selectedIcon={
                            <div className="iconfont icon-findHouse" />
                        }
                        title="找房"
                        key="Found"
                        selected={this.state.selectedTab === 'redTab'}
                        onPress={() => {
                            this.props.history.push("/home/found")
                        }}

                    >
                        <Route path="/home/found" component={Found}></Route>
                    </TabBar.Item>
                    <TabBar.Item
                        icon={
                            <div className="iconfont icon-my" />
                        }
                        selectedIcon={
                            <div className="iconfont icon-my" />
                        }
                        title="我的"
                        key="My"
                        dot
                        selected={this.state.selectedTab === 'greenTab'}
                        onPress={() => {
                            this.props.history.push("/home/my")
                        }}
                    >
                        <Route path="/home/my" component={My}></Route>
                    </TabBar.Item>
                </TabBar>
            </div>
        );
    }
}

export default TabBarTest;